<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <base href="<%=basePath%>"/>
    <title>茶叶进销存系统 - 编辑物流</title>
    <link rel="stylesheet" href="css/global.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
    <style>
        .form-container {
            max-width: 600px;
            margin: 0 auto;
            padding: 20px;
        }
        .form-group {
            margin-bottom: 20px;
        }
        .form-group label {
            display: block;
            margin-bottom: 8px;
            font-weight: 500;
            color: var(--text-regular);
        }
        .form-control {
            width: 100%;
            padding: 10px 15px;
            border: 1px solid var(--border-color);
            border-radius: 4px;
            font-size: 14px;
            transition: all 0.3s;
            background-color: #fff;
        }
        .form-control:focus {
            outline: none;
            border-color: var(--primary-color);
            box-shadow: 0 0 0 2px rgba(139, 158, 107, 0.2);
        }
        .readonly-field {
            background-color: #f9faf7;
            cursor: not-allowed;
        }
        .btn-group {
            display: flex;
            justify-content: flex-end;
            gap: 15px;
            margin-top: 30px;
        }
        .tea-icon {
            color: var(--primary-color);
            margin-right: 5px;
        }
        .form-header {
            font-size: 18px;
            color: var(--text-regular);
            margin-bottom: 20px;
            padding-bottom: 10px;
            border-bottom: 1px solid var(--border-color);
        }
        .alert {
            padding: 10px 15px;
            margin-bottom: 20px;
            border-radius: 4px;
            background-color: #fef0f0;
            color: var(--danger-color);
            border: 1px solid #fde2e2;
        }
        .form-row {
            display: flex;
            gap: 20px;
        }
        .form-col {
            flex: 1;
        }
    </style>
</head>
<body>
<div class="app-container">
    <!-- 侧边栏 -->
    <div class="sidebar" id="sidebar">
        <div class="sidebar-logo" onclick="toggleSidebar()">
            <span><i class="fas fa-leaf tea-icon"></i> 茶叶进销存系统</span>
        </div>

        <div class="sidebar-menu">
            <div
                    class="menu-item "
                    onclick="location.href='views/home.jsp'"
            >
                <i class="fas fa-home"></i>
                <span>系统首页</span>
            </div>
            <div class="menu-item" onclick="location.href='TeaServlet'">
                <i class="fas fa-coffee"></i>
                <span>茶叶管理</span>
            </div>
            <div class="menu-item" onclick="location.href='CategoryServlet'">
                <i class="fas fa-tags"></i>
                <span>分类管理</span>
            </div>
            <div class="menu-item" onclick="location.href='WarehouseServlet'">
                <i class="fas fa-boxes"></i>
                <span>仓库管理</span>
            </div>
            <div class="menu-item" onclick="location.href='OrderServlet'">
                <i class="fas fa-receipt"></i>
                <span>订单管理</span>
            </div>
            <div class="menu-item active" onclick="location.href='LogisticsServlet'">
                <i class="fas fa-shipping-fast"></i>
                <span>物流管理</span>
            </div>
            <div class="menu-item" onclick="location.href='SupplierServlet'">
                <i class="fas fa-truck"></i>
                <span>供应商管理</span>
            </div>
            <div class="menu-item" onclick="location.href='<%=basePath%>purchase/list'">
                <i class="fas fa-truck"></i>
                <span>采购管理</span>
            </div>
            <div class="menu-item" onclick="location.href='CustomerServlet'">
                <i class="fas fa-users"></i>
                <span>客户管理</span>
            </div>
            <div class="menu-item" onclick="location.href='AddressServlet'">
                <i class="fas fa-map-marker-alt"></i>
                <span>地址管理</span>
            </div>
        </div>
    </div>

    <!-- 主内容区 -->
    <div class="main-content">
        <!-- 顶部导航栏 -->
        <div class="navbar">
            <div class="navbar-left">
                <h3><i class="fas fa-edit tea-icon"></i> 编辑物流</h3>
            </div>
            <div class="navbar-right">
                <span><i class="fas fa-user tea-icon"></i>欢迎，${ username}管理员</span>
                <a href="logout" class="el-link el-link--danger ml-10"><i class="fas fa-sign-out-alt"></i> 退出</a>
            </div>
        </div>

        <!-- 内容卡片 -->
        <div class="el-card fade-in">
            <div class="el-card__header">
                <span><i class="fas fa-info-circle tea-icon"></i> 物流详细信息</span>
            </div>
            <div class="el-card__body">
                <form action="LogisticsServlet?action=update" method="post" class="form-container">
                    <!-- 错误信息显示 -->
                    <c:if test="${not empty error}">
                        <div class="alert"><i class="fas fa-exclamation-circle"></i> ${error}</div>
                    </c:if>

                    <div class="form-header">
                        <i class="fas fa-shipping-fast tea-icon"></i> 基本信息
                    </div>

                    <div class="form-group">
                        <label for="logistics_id"><i class="fas fa-barcode tea-icon"></i> 物流编号</label>
                        <input type="text" id="logistics_id" name="logistics_id" class="form-control readonly-field"
                               value="${logistics.logistics_id}" readonly>
                    </div>

                    <div class="form-group">
                        <label for="order_no"><i class="fas fa-receipt tea-icon"></i> 关联订单</label>
                        <input type="text" id="order_no" class="form-control readonly-field"
                               value="${logistics.order_no}" readonly>
                    </div>

                    <div class="form-row">
                        <div class="form-col">
                            <div class="form-group">
                                <label for="logistics_no"><i class="fas fa-barcode tea-icon"></i> 物流单号</label>
                                <input type="text" id="logistics_no" name="logistics_no" class="form-control"
                                       value="${logistics.logistics_no}" placeholder="请输入物流单号" required maxlength="50">
                            </div>
                        </div>
                        <div class="form-col">
                            <div class="form-group">
                                <label for="status"><i class="fas fa-flag tea-icon"></i> 物流状态</label>
                                <select id="status" name="status" class="form-control">
                                    <option value="0" ${logistics.status == 0 ? 'selected' : ''}>运输中</option>
                                    <option value="1" ${logistics.status == 1 ? 'selected' : ''}>已送达</option>
                                </select>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="logistics_company"><i class="fas fa-truck tea-icon"></i> 物流公司</label>
                        <select id="logistics_company" name="logistics_company" class="form-control" required>
                            <option value="">请选择物流公司</option>
                            <option value="顺丰速运" ${logistics.logistics_company == '顺丰速运' ? 'selected' : ''}>顺丰速运</option>
                            <option value="圆通速递" ${logistics.logistics_company == '圆通速递' ? 'selected' : ''}>圆通速递</option>
                            <option value="中通快递" ${logistics.logistics_company == '中通快递' ? 'selected' : ''}>中通快递</option>
                            <option value="申通快递" ${logistics.logistics_company == '申通快递' ? 'selected' : ''}>申通快递</option>
                            <option value="韵达速递" ${logistics.logistics_company == '韵达速递' ? 'selected' : ''}>韵达速递</option>
                            <option value="百世快递" ${logistics.logistics_company == '百世快递' ? 'selected' : ''}>百世快递</option>
                            <option value="德邦快递" ${logistics.logistics_company == '德邦快递' ? 'selected' : ''}>德邦快递</option>
                            <option value="京东物流" ${logistics.logistics_company == '京东物流' ? 'selected' : ''}>京东物流</option>
                            <option value="邮政EMS" ${logistics.logistics_company == '邮政EMS' ? 'selected' : ''}>邮政EMS</option>
                        </select>
                    </div>

                    <div class="form-row">
                        <div class="form-col">
                            <div class="form-group">
                                <label for="shipping_time"><i class="fas fa-calendar tea-icon"></i> 发货时间</label>
                                <input type="datetime-local" id="shipping_time" name="shipping_time" class="form-control"
                                       value="<fmt:formatDate value='${logistics.shipping_time}' pattern='yyyy-MM-dd\'T\'HH:mm'/>">
                            </div>
                        </div>
                        <div class="form-col">
                            <div class="form-group">
                                <label for="receiver_time"><i class="fas fa-calendar-check tea-icon"></i> 收货时间</label>
                                <input type="datetime-local" id="receiver_time" name="receiver_time" class="form-control"
                                       value="<fmt:formatDate value='${logistics.receiver_time}' pattern='yyyy-MM-dd\'T\'HH:mm'/>">
                                <small style="color: var(--text-secondary); margin-top: 5px; display: block;">
                                    <i class="fas fa-info-circle"></i> 可选，收货后填写
                                </small>
                            </div>
                        </div>
                    </div>

                    <div class="btn-group">
                        <button type="button" class="el-button" onclick="history.back()">
                            <i class="fas fa-times"></i> 取消
                        </button>
                        <button type="submit" class="el-button el-button--primary">
                            <i class="fas fa-save"></i> 保存修改
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    // 侧边栏收缩状态
    let isCollapsed = false;

    // 切换侧边栏状态
    function toggleSidebar() {
        const sidebar = document.getElementById('sidebar');
        isCollapsed = !isCollapsed;

        if(isCollapsed) {
            sidebar.classList.add('collapsed');
            localStorage.setItem('sidebarCollapsed', 'true');
        } else {
            sidebar.classList.remove('collapsed');
            localStorage.setItem('sidebarCollapsed', 'false');
        }
    }

    // 页面加载时检查状态
    window.onload = function() {
        const savedState = localStorage.getItem('sidebarCollapsed');
        if(savedState === 'true') {
            document.getElementById('sidebar').classList.add('collapsed');
            isCollapsed = true;
        }

        // 状态变化时自动设置收货时间
        document.getElementById('status').addEventListener('change', function() {
            const receiverTimeInput = document.getElementById('receiver_time');
            if(this.value == '1' && !receiverTimeInput.value) {
                // 如果状态改为已送达且没有收货时间，自动设置为当前时间
                const now = new Date();
                const year = now.getFullYear();
                const month = String(now.getMonth() + 1).padStart(2, '0');
                const day = String(now.getDate()).padStart(2, '0');
                const hours = String(now.getHours()).padStart(2, '0');
                const minutes = String(now.getMinutes()).padStart(2, '0');
                const defaultTime = `${year}-${month}-${day}T${hours}:${minutes}`;
                receiverTimeInput.value = defaultTime;
            }
        });

        // 表单提交验证
        document.querySelector('form').addEventListener('submit', function(e) {
            const logisticsNo = document.getElementById('logistics_no').value.trim();
            const logisticsCompany = document.getElementById('logistics_company').value;

            if(!logisticsNo) {
                alert('物流单号不能为空');
                e.preventDefault();
                return;
            }

            if(!logisticsCompany) {
                alert('请选择物流公司');
                e.preventDefault();
                return;
            }
        });
    }
</script>
</body>
</html>
